<template>
	<view class="applyBox">
		<section class="cart margin3" v-if='showBtn'>
			<goodsCart  :sendData="sendData" :status="status" :tabState='tabState'></goodsCart>
		</section>
		<section class="cart margin3" v-if='!showBtn' >
			<delayItem :sendData='sendData'></delayItem>
		</section>
		<view class="margin3" v-if="!showBtn" >
			<u-collapse>
				<u-collapse-item @change="clickCell" v-for="(item, index) in itemListSee" :disabled='true' :title="item.head"  :key="index" :open="item.open">{{ item.body }}</u-collapse-item>
			</u-collapse>
			<u-calendar v-model="showDate" @change="changeDate" :max-date="dateMax" :mode="mode"></u-calendar>
			<view>{{selectdate}}</view>
		</view>
		<view class="margin3" v-if="showBtn" >
			<u-collapse>
				<u-collapse-item @change="clickCell" v-for="(item, index) in itemList" :disabled='item.disabled' :title="item.head"  :key="index" :open="item.open">{{ item.body }}</u-collapse-item>
			</u-collapse>
			<u-calendar v-model="showDate" @change="changeDate" :max-date="dateMax" :mode="mode"></u-calendar>
			<view>{{selectdate}}</view>
		</view>
		
		<view class="margin3"  >
			<u-collapse 	:arrow="false">
				<u-collapse-item disabled='true' :title="item.head" v-for="(item, index) in reasonList" :key="index" :open="item.open">
				<u-input v-model="reasonText" type="textarea" placeholder='[]'  auto-height="true" border="true"   />
				</u-collapse-item>
			</u-collapse>
		</view>
		<view class="margin3"   >
			<u-upload :action="action" :file-list="fileList"  style=" "></u-upload>
			<view class="upBox" @click="chooseImage" v-if="showBtn">
				<view>
					<u-icon name="plus" size="50rpx" class="upIcon"></u-icon>
				</view>
				
				上传图片
			</view>
			<!-- <u-button type="primary" shape="square"  :custom-style="btnStyle"  >上传图片</u-button> -->
			
		</view>
		<view class="margin3 textCenter" v-if="showBtn"  >
			<u-button type="warning" shape="square" size="medium" :custom-style="btnStyle"   @click="agoRecord">记录</u-button>
			<u-button type="primary" shape="square" size="medium" :custom-style="btnStyle"   @click="submitReason"> 提交 </u-button>
			</view>
		<view>
		</view>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	const actions = new Map([
			[1, ['businessLicenseImg']],
			[2, ['idCardFrontImg']],
			[3, ['idCardBackImg']],
	])
	import goodsCart from './components/goodsCart.vue';
	import delayItem from './components/delayItem.vue';
	import { mapGetters } from 'vuex';
	export default {
		components: {
			goodsCart,
			delayItem
		},
		computed: {
			...mapGetters(['goodItem'])
		},
		onReady() {
			console.log(this.goodItem);
			this.sendData = this.goodItem.data
			if(this.optionId >1){
				console.log('///////////iiiiidddddd')
				this.showBtn = false
				uni.setNavigationBarTitle({
					title: '申请详情'
				});
				this.$store
					.dispatch('getApplyInfo',{id:this.optionId})
					.then(res => {
						if (res.data.errorCode === 0) {
							 console.log((res.data.data.applyReason).toString())
							 this.sendData = res.data.data
							 this.selectdate = res.data.data.delayDate
							 this.reasonText =  (res.data.data.applyReason).toString()
						}	
					})
			}
		},
		onLoad(option) {
			console.log('????',option)
			this.optionId = option.id
			if(option.workNo ){
				console.log('option.workId')
				this.showBtn =true
			}
			
		},
		data() {
			return {
				optionId:'',
				showBtn:true,
				btnStyle:{
				margin:'20rpx'
				},
				reasonText:'',
				// 演示地址，请勿直接使用
				action: 'http://up-z1.qiniup.com',
				fileList: [
				],
				itemListSee: [{ head: '延期时间', open: true, body: '' }],
				itemList: [{ head: '延期时间', open: true, body: '',disabled:false }],
				reasonList: [{ head: '延期原因', open: true, body: '' }],
				sendData:{},
				status:'',
				tabState:'',
				showDate:false,
				selectdate:'----',
				dateMax: '2099-01-01',
				mode: 'date',
			}
		},
		methods: {
			agoRecord(){
				console.log('[agorecord click]')
				uni.navigateTo({
					url: '/pages/workOrder/agoRecord'
				});
			},
			submitReason(){
				console.log('.... delayApplyRepairWorkOrder')
				let reas =[]
				reas[0]= this.reasonText
				let imgList =[]
				for(let i = 0;i<this.fileList.length;i++){
					imgList.push(this.fileList[i].url)
				}
				console.log(imgList)
				let params ={
					"orderNo": this.goodItem.data.workNo,
					"orderType": 2,
					"delayDate":this.selectdate ,
					"reasons": reas,
					"attachment": imgList
				}
				console.log(params)
				if(this.selectdate == '' ){
					this.$refs.uToast.show({
						title: '请选择时间',
						type: 'error',
					})
					return
				}
				console.log(reas == [""],this.reasonText)
				if(!this.reasonText ){
					this.$refs.uToast.show({
						title: '请输入原因',
						type: 'error',
					})
					return
				}  
			   if(imgList.length == 0){
				this.$refs.uToast.show({
					title: '请上传图片',
					type: 'error',
				})
				return
				}
				this.$store.dispatch('delayApplyRepairWorkOrder',{body:params }).then(res => {
					if (res.data.errorCode === 0) {
						console.log(res.data);
						uni.switchTab({
							url: '/pages/workOrder/workOrder'
						});
					}
				});
			},
			chooseImage(){
				  uni.chooseImage({
				    count: 1,
				    sizeType: ['original', 'compressed'],
				    sourceType: ['album','camera'],
				    success: (res) => {
				      let fileInfo = res.tempFiles
					  let tempFilePaths = res.tempFilePaths[0]
				      let data = {
				        fileName: 'image.png',
				        bucket: 'yby-files',
				      }
				      //获取上传文件token
				      this.$store.dispatch('getUploadFileToken',data)
				        .then((ret) => {
						  let fileName = ret.data.data.fileName
						 const uploadTask =  uni.uploadFile({
							  url: 'https://up-z1.qiniup.com', 
							  filePath: tempFilePaths,
							  name: 'file',
							  formData: {
								token:ret.data.data.token,
								key:ret.data.data.key,
							  },
							  success: (uploadFileRes) => {
								   
								  let uploadFile = JSON.parse(uploadFileRes.data)
								    let action = actions.get(5)
									console.log(action)
									console.log(uploadFile)
									this.fileList.push({url:'http://files.ybangy.net/'+uploadFile.key})
									// this.imgSrcVal = 'http://files.ybangy.net/'+uploadFile.key
									// this.$emit('upload',uploadFile.key,num)
							  }
						  });
				        })
				        .catch((err) => {})
				    },
				  })
			},
			clickCell() {
				console.log('///');
				this.showDate = true;
			},
			changeDate(e) {
				console.log(e);
				this.itemList[0].body= e.result
				this.selectdate = e.result;
			},
		},
		
	}
</script>

<style lang="scss" >
	.applyBox{
		.textCenter {
			text-align: center;
		}
		.margin3 {
			margin: 30rpx;
			background: #ffffff;
			padding: 24rpx 40rpx;
			border-radius: 20rpx;
			.upBox{
				width: 140rpx;
				height: 140rpx;
				text-align: center;
				background: #fafafa;
				border-radius: 10rpx;
			}
			.upIcon{
				margin: 20rpx;
			}
		}
			.u-upload{
				/deep/
				.u-add-wrap{
					display: none;
				}
			}
	}
</style>
